import {computed, ComputedRef, Ref, ref} from "vue";
import {GroupBase} from "@/pages/group/type";
import {UserBase} from "@/type";

interface UseGroupDetailInit {
    btnType: ComputedRef<"error" | "info">
    btnText: ComputedRef<"取消管理" | "管理团队">
    viewReady: Ref<Boolean>
    groupBase: Ref<GroupBase>
    groupMember: Ref<UserBase[]>
    groupManageable: Ref<Boolean>
}

export function useGroupDetailInit(): UseGroupDetailInit {
    const viewReady = ref(false)
    const groupMember = ref<UserBase[]>([])
    const groupManageable = ref<boolean>(false)
    const groupBase = ref<GroupBase>({
        group_id: 0,
        name: "",
        desc: "",
        cover: "",
        invitation_code: "",
        leader_id: 0,
    })

    const btnText = computed(() => {
        return groupManageable.value ? "取消管理" : "管理团队"
    })
    const btnType = computed(() => {
        return groupManageable.value ? "error" : "info"
    })

    return {
        btnType,
        btnText,
        viewReady,
        groupBase,
        groupMember,
        groupManageable
    }
}